/**
 * Created by Administrator on 2017/12/4.
 */
import React from 'react';
import $ from 'jquery'
import { Input, Icon ,Checkbox} from 'antd';
import {
    R_header_fixed
} from '../common/index'
import Link from '../common/Link'
import {
    HttpService,
    pullDownRefresh,
    Tips
} from '../../Tools'
// import './mock/order'
import './style/business.scss'
import LoadingBox from '../common/LoadingBox'
import Arrow from './img/arrow.png'
export  default  class OrderManage extends React.Component {
    constructor(props) {
        super(props);
        this.page = 1;
        this.pagesize = 10;
        this.toBottom = 60;
        this.state = {
            userName: '',
            dataList: [],
            dataLoad: 1,
            dataNull: 0,
            dataEnd: 0
        };
    }

    componentwillunmount(){
        window.onscroll =null;
    }
    componentDidMount() {
        this.getData()
        //加载更多
        window.onscroll = () => {
            const {
                dataEnd,
                dataNull,
                page
            } = this.state;
            if (this.dataLoad == 1 || dataEnd == 1 || dataNull == 1)
                return;
            var scrollTop = 0;
            if (document.documentElement && document.documentElement.scrollTop) {
                scrollTop = document.documentElement.scrollTop;
            } else if (document.body) {
                scrollTop = document.body.scrollTop;
            }
            if (document.body.clientHeight - window.innerHeight - scrollTop <= this.toBottom) {
                this.page++;
                this.getData();
            }
        }
        const obj = document.getElementById('refreshbox')
        const contentObj = document.getElementById('pdownrefresh')
        const statusObj = document.getElementById('status')
        let rct = this;
        pullDownRefresh(obj, contentObj, statusObj, 70, function(data) {
            if (data.status == 'end' && data.top >= 50) {
                this.page = 1;
                this.getData(1);
            }
        }.bind(this))
    }

    //获取数据列表
    getData(status) {
        this.setState({
            dataLoad: 1,
            dataEnd: 0,
            dataNull: 0
        });
        if (status == 1)
            this.page = 1
        HttpService.query({
            url: '/jf/business/order/pageOrderByCompany',
            async:false,
            data: {
                token: localStorage.btoken,
                page: this.page,
                size: this.pagesize,
                companyId:localStorage.companyId
            },
            success: (res => {
                this.setState({
                    dataLoad: 0
                });
                if (res.code == "10140") {
                    //获取数据成功
                    let dataList = res.data.list
                    if (status != 1)
                        dataList = this.state.dataList.concat(res.data.list);
                    this.setState({
                        dataList
                    });
                    if (res.data.totalPages == this.page) {
                        this.setState({
                            dataEnd: 1
                        });
                    } else if (res.data.list.length < this.pagesize) {
                        this.setState({
                            dataEnd: 1
                        });
                        if (dataList.length == 0) {
                            this.setState({
                                dataEnd: 0,
                                dataNull: 1
                            });
                        }
                    }
                    return;
                }
                Tips(res.data);
            })
        })
    }

    searchClick(e){
        const serarch=document.getElementsByClassName('orderNum')[0].value;
        let rec=this;
        $.ajax({
            url: '/jf/business/order/pageOrderByCompany',
            async:false,
            data: {
                token:localStorage.btoken,
                page:1,
                size:10,
                companyId:localStorage.companyId,
                orderSerialNum:serarch
            },
            success:function(res){
                if(res.code=='10140'){
                        rec.setState({
                            dataList:res.data.list
                        });
                }else{
                    Tips(res.data);
                }

            }
        });
    }


    render() {
        const {dataList,  dataLoad, dataNull, dataEnd} = this.state;
        let dataLists= dataList.map(function (item) {
                return (

                    <li className="list" key={item.id}>
                        <Link to={ 'orderDetail/' + item.orderSerialNum}>
                        <div className="media media-item">
                            <div className="media-body">
                                <div className="orderNumber">
                                    <span>订单编号：</span>
                                    <span>{item.orderSerialNum}</span>
                                </div>
                                <div className="name">
                                    <span>商品名称：</span>
                                    <span>{item.orderName}</span>
                                </div>
                                <div>
                                    <span>商品金额：</span>
                                    <span>{item.orderMoney}</span>
                                </div>
                            </div>
                            <div className="media-right media-middle">

                                    <img src={Arrow}/>

                            </div>
                        </div>
                    </Link>
                    </li>

                )
            }.bind(this))


        return (
            <div className="order">
                <R_header_fixed left="1" title="订单管理"/>
                <div id='refreshbox'>
                    <div id='status'><span></span></div>
                    <div id='pdownrefresh'>
                        <div className="orderManage">
                            <div className="searchBox">
                                <div className="input-group">
                                    <input type="text" className="form-control orderNum" placeholder="请输入订单号" />
                                    <span className="input-group-btn">
                                <button className="btn btn-default" type="button" onClick={this.searchClick.bind(this)}>查询</button>
                              </span>
                                </div>
                            </div>
                            <ul>
                                {dataLists}
                                <LoadingBox dataLoad={dataLoad} dataNull={dataNull} dataEnd={dataEnd} dataNullMsg='暂无订单记录' />
                            </ul>
                        </div>
                    </div>
                </div>

            </div>
        )
    }
}